<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-3.6.0.min.js"></script>
    <script>

        function keypress2() {
            var text1 = document.getElementById("content").value;
            var len; //记录剩余字符串的长度
            if (text1.length >=8) {
                document.getElementById("content").value = text1.substr(0, 8);
                document.getElementById("a01").innerText = "用户名最多8个字符";
                len = 0;
            } else {
                len = 8 - text1.length;
            }
            document.getElementById("msg").innerText = "还能输入："+len+"个字符";
        }



    </script>
</head>
<body>

自我介绍：
<div >
    <textarea id="content"  onKeyUp="keypress2()" onblur="keypress2()"></textarea>
    <span id="a01"></span>
</div>
<div id="msg">
    还能输入：8个字符
</div>

</body>
</html>